function observe (value, cb) {
  // 遍历所有属性 将属性响应式化 这里为了便于理解 去掉了递归的过程
  Object.keys(value).forEach(key => defineReactive(value, key, value[key], cb))
}

function defineReactive (obj, key, val, cb) {
  Object.defineProperty(obj, key, {
    enumerable: true, // 属性可以枚举
    configurable: true, // 属性可以被修改或删除
    get: () => {
      // 在这里会进行依赖收集
      console.log('触发get方法')
      return val
    },
    set: newVal => {
      val = newVal;
      cb(); // 这里我们触发渲染
    }
  })
}

class Vue {
  constructor (options) { // Vue的构造函数
    this._data = options.data; // 这里的data可以看做是Vue项目组件中的data
    observe(this._data, options.render) // 将data中的数据响应化，即变成可观察的，属性的读和写，都会被Vue知道
  }
}

let app = new Vue({
  el: '#app',
  data: {
    text: 'text',
    text2: 'text2'
  },
  render () {
    console.log('render')
  }
})
app._data.text // 调用get方法
app._data.text = '测试' // 属性值被修改，set方法会被调用